import 'package:flutter/material.dart';
import '../demo/ui_demo.dart';
import 'package:intl/intl.dart';
import '../wonders/framework.dart';

class MyDemo extends StatelessWidget implements Demo {
  MyDemo(this.title);
  @override
  String title;
  @override
  Widget build(BuildContext context) {
    return new HomePage(title: this.title,);
  }
}

class HomePage extends StatelessWidget {
  String title;
  HomePage({this.title});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(this.title),
        centerTitle: true,
        elevation: 0,
        actions: <Widget>[
          IconSource("Button","10"),
        ],
      ),
      body: _ButtonDemo(),
    );
  }
}

class _ButtonDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: <Widget>[
        ListItem("FloatingActionButton", _FloatActionButton()),
        ListItem("Button", _Button()),
        ListItem("PopupMenuButton", _PopupMenuButtonDemo()),
        ListItem("CheckBox", CheckBoxDemo()),
        ListItem("RadioBox", RadioBoxDemo()),
        ListItem("Switch", SwitchDemo()),
        ListItem("Slider", SliderDemo()),
        ListItem("DateTime", DateTimeDemo()),
        ListItem("Chip", ChipDemo()),
      ],
    );
  }
}

class ListItem extends StatelessWidget {
  final String title;
  final Widget page;
  const ListItem(this.title, this.page);
  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(this.title),
      onTap: () {
        Navigator.of(context)
            .push(MaterialPageRoute(builder: (context) => page));
      },
    );
  }
}

class _FloatActionButton extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _FloatActionButtonState();
}

class _FloatActionButtonState extends State<_FloatActionButton> {
  final floatActionButton = FloatingActionButton(
    child: Icon(Icons.add),
    onPressed: null,
    backgroundColor: Colors.black87,
    elevation: 0.0,
    shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(30.0)),
  );
  final floatActionButtonExent = FloatingActionButton.extended(
    onPressed: null,
    icon: Icon(Icons.add),
    label: Text("添加"),
  );
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("floatingActionButton"),
      ),
      floatingActionButton: floatActionButton,
      floatingActionButtonLocation: FloatingActionButtonLocation.endDocked,
      bottomNavigationBar: BottomAppBar(
        child: Container(
          height: 80.0,
        ),
      ),
    );
  }
}

class _Button extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final _imageButton = FlatButton(
      onPressed: () {},
      child: Container(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Image(
              image: AssetImage("assets/images/jiaoyu.png"),
              height: 40.0,
            ),
            Text("school"),
          ],
        ),
      ),
    );
    final _flatButton = FlatButton(
      child: Text(
        "FlatButton",
      ),
      splashColor: Colors.white10,
      color: Theme.of(context).accentColor,
      onPressed: () {},
    );
    final _flatButtonIcon = FlatButton.icon(
      icon: Icon(
        Icons.save,
        color: Colors.white,
      ),
      label: Text(
        "FlatButton.icon",
        style: TextStyle(color: Colors.white),
      ),
      splashColor: Colors.white10,
      color: Theme.of(context).accentColor,
      onPressed: () {},
    );
    final _raiseButton = RaisedButton(
      child: Text(
        "RaisedButton",
        style: TextStyle(color: Colors.white),
      ),
      splashColor: Colors.white10,
      color: Theme.of(context).accentColor,
      elevation: 0.0,
      onPressed: () {},
    );
    final _raiseButtonIcon = RaisedButton.icon(
      icon: Icon(
        Icons.save,
        color: Colors.white,
      ),
      label: Text(
        "RaisedButton.icon",
        style: TextStyle(color: Colors.white),
      ),
      splashColor: Colors.white10,
      elevation: 20,
      color: Theme.of(context).accentColor,
      onPressed: () {},
    );
    final _outLineButton = OutlineButton(
      child: Text(
        "OutlineButton",
      ),
      splashColor: Colors.white10,
      onPressed: () {},
      textColor: Colors.black,
      borderSide: BorderSide(color: Colors.black87),
    );
    final _outLineButtonIcon = OutlineButton.icon(
      icon: Icon(
        Icons.save,
        color: Colors.white,
      ),
      highlightedBorderColor: Colors.grey,
      label: Text(
        "OutlineButton.icon",
      ),
      splashColor: Colors.white10,
      onPressed: () {},
    );
    final _themFlatButton = Theme(
      data: Theme.of(context).copyWith(
        //buttonColor: Theme.of(context).primaryColor,
        buttonColor: Colors.black87,
        buttonTheme: ButtonThemeData(
            //textTheme: ButtonTextTheme.primary,
            shape: StadiumBorder()),
      ),
      child: _flatButton,
    );
    return Scaffold(
      appBar: AppBar(title: Text("Button")),
      body: Container(
        alignment: Alignment(0.0, 0.0),
        padding: EdgeInsets.all(8.0),
        child: LinearLayout(
          //isVisible: true,
          orientation: Axis.vertical,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            _imageButton,
            SizedBox(
              height: 30.0,
            ),
            _themFlatButton,
           _flatButton,
            Container(
              width: double.infinity,
             child: _flatButtonIcon,
            ),
           _raiseButton,
            _raiseButtonIcon,
            _outLineButton,
            _outLineButtonIcon
          ],
        ),
      ),
    );
  }
}

class _PopupMenuButtonDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _PopupMenuButtonState();
}

class _PopupMenuButtonState extends State<_PopupMenuButtonDemo> {
  String _currentItemValue = "Select";
  @override
  Widget build(BuildContext context) {
    debugPrint("build execute!$_currentItemValue");
    _setSelect(value) {
      setState(() {
        _currentItemValue = value;
      });
    }

    return Scaffold(
      appBar: AppBar(
        title: Text("PopupMenuButton"),
      ),
      body: Container(
        padding: EdgeInsets.all(8.0),
        alignment: Alignment(0, 0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(_currentItemValue),
            PopupMenuButton(
              icon: Icon(Icons.home),
              onSelected: _setSelect,
              itemBuilder: (BuildContext context) => [
                    PopupMenuItem(value: "HOME", child: Text("HOME")),
                    PopupMenuItem(
                        value: "DESCRIPTION", child: Text("DESCRIPTION")),
                    PopupMenuItem(value: "ABOUT", child: Text("ABOUT")),
                  ],
            )
          ],
        ),
      ),
    );
  }
}

class CheckBoxDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return CheckBoxStateDemo();
  }
}

class CheckBoxStateDemo extends State<CheckBoxDemo> {
  bool _checkBox = false;
  bool _checkBoxTile = false;
  String _checkBoxValue = "";
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("CheckBox"),
      ),
      body: Container(
        padding: EdgeInsets.all(10.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            CheckboxListTile(
              value: _checkBox,
              title: Text("CheckBoxItemA"),
              subtitle: Text("Subtitle"),
              secondary: Icon(Icons.label),
              selected: _checkBox,
              onChanged: (value) {
                setState(() {
                  _checkBox = value;
                });
              },
            ),
            Row(
              children: <Widget>[
                Checkbox(
                  value: _checkBoxTile,
                  onChanged: (value) {
                    setState(() {
                      _checkBoxTile = value;
                      _checkBoxValue = value ? "yes" : "no";
                    });
                  },
                ),
                Text("$_checkBoxValue"),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

class RadioBoxDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => RadioBoxStateDemo();
}

class RadioBoxStateDemo extends State<RadioBoxDemo> {
  int _groupValue = 1;
  int _groupValue2 = 3;
  _setRadio(value) {
    setState(() {
      _groupValue = value;
    });
  }

  _setRadio2(value) {
    setState(() {
      _groupValue2 = value;
    });
  }

  @override
  Widget build(BuildContext context) {
    debugPrint("groupvalue:$_groupValue");
    debugPrint("groupvalue2:$_groupValue2");
    return Scaffold(
      appBar: AppBar(
        title: Text("RadioBox"),
      ),
      body: Container(
        padding: EdgeInsets.all(10.0),
        child: Column(
          children: <Widget>[
            RadioListTile(
                title: Text("playboll"),
                subtitle: Text("subtitle playboll"),
                secondary: Icon(Icons.label),
                selected: _groupValue == 1,
                value: 1,
                groupValue: _groupValue,
                onChanged: _setRadio),
            RadioListTile(
                title: Text("swiming"),
                subtitle: Text("subtitle swiming"),
                secondary: Icon(Icons.mail),
                selected: _groupValue == 2,
                value: 2,
                groupValue: _groupValue,
                onChanged: _setRadio),
            Radio(
              value: 3,
              groupValue: _groupValue2,
              onChanged: _setRadio2,
              activeColor: Colors.black,
            ),
            Radio(
              value: 4,
              groupValue: _groupValue2,
              onChanged: _setRadio2,
              activeColor: Colors.black,
            )
          ],
        ),
      ),
    );
  }
}

class SwitchDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return SwitchStateDemo();
  }
}

class SwitchStateDemo extends State<SwitchDemo> {
  bool _switchValue = false;
  bool _switchListTile = false;
  @override
  Widget build(BuildContext context) {
    debugPrint("_switchValue:$_switchValue");
    debugPrint("_switchListTile:$_switchListTile");
    return Scaffold(
      appBar: AppBar(title: Text("Radio")),
      body: Container(
        alignment: Alignment(0.0, 0.0),
        padding: EdgeInsets.all(8.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Switch(
              value: _switchValue,
              onChanged: (value) {
                setState(() {
                  _switchValue = value;
                });
              },
            ),
            SwitchListTile(
                value: _switchListTile,
                title: Text("switchListTile"),
                subtitle: Text("subtitle switchList"),
                secondary: Icon(Icons.add_alarm),
                onChanged: (value) {
                  setState(() {
                    _switchListTile = value;
                  });
                })
          ],
        ),
      ),
    );
  }
}

class SliderDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return SliderStateDemo();
  }
}

class SliderStateDemo extends State<SliderDemo> {
  double _sliderItemValue = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Slider"),
      ),
      body: Container(
        margin: EdgeInsets.only(top: 50.0),
        child: ListView(
          children: <Widget>[
            Slider(
              value: _sliderItemValue,
              activeColor: Theme.of(context).primaryColor,
              inactiveColor: Theme.of(context).primaryColor.withOpacity(0.3),
              divisions: 100,
              min: 0,
              max: 100,
              label: "${_sliderItemValue.toInt()}",
              onChanged: (value) {
                setState(() {
                  _sliderItemValue = value;
                });
              },
            ),
            SizedBox(
              height: 10.0,
            ),
            Text("sliderValue:${_sliderItemValue.toInt()}")
          ],
        ),
      ),
    );
  }
}

class DateTimeDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return DateTimeState();
  }
}

class DateTimeState extends State<DateTimeDemo> {
  DateTime _selectDateTime = DateTime.now();
  TimeOfDay _timeOfDay = TimeOfDay(hour: 9, minute: 30);
  _showSelectDateTime() async {
    DateTime selectDatetime = await showDatePicker(
        context: context,
        initialDate: _selectDateTime,
        firstDate: DateTime(1900),
        lastDate: DateTime(2999));
    if (selectDatetime != null) {
      setState(() {
        _selectDateTime = selectDatetime;
      });
    }
  }

  _showSelectTime() async {
    TimeOfDay timeOfDay =
        await showTimePicker(context: context, initialTime: _timeOfDay);
    if (timeOfDay != null) {
      setState(() {
        _timeOfDay = timeOfDay;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("DateTime"),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          InkWell(
            onTap: _showSelectDateTime,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(DateFormat.yMd("zh").format(_selectDateTime)),
                Icon(Icons.arrow_drop_down),
              ],
            ),
          ),
          InkWell(
            onTap: _showSelectTime,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(_timeOfDay.format(context)),
                Icon(Icons.arrow_drop_down),
              ],
            ),
          )
        ],
      ),
    );
  }
}

class ChipDemo extends StatefulWidget {
  @override
  _ChipDemoState createState() => _ChipDemoState();
}

class SmallTip {
  final int id;
  final String title;
  SmallTip(this.id, this.title);
}

class _ChipDemoState extends State<ChipDemo> {
  List<SmallTip> _tips = [
    SmallTip(11, "apple"),
    SmallTip(22, "banana"),
    SmallTip(33, "lemon"),
  ];
  int _actionIndex = 0;
  List<SmallTip> _filterIndex = [];
  int _choiceIndex=0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Chip"),
      ),
      body: Container(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Wrap(
              spacing: 10.0,
              runSpacing: 20.0,
              children: <Widget>[
                Chip(label: Text("apple")),
                Chip(
                  label: Text("banana"),
                  backgroundColor: Colors.yellow,
                ),
                Chip(
                  label: Text("lemon"),
                  backgroundColor: Theme.of(context).buttonColor,
                  avatar: CircleAvatar(
                    child: Text("柠"),
                    backgroundColor: Theme.of(context).accentColor,
                  ),
                ),
                Chip(
                  label: Text("orange"),
                  backgroundColor: Theme.of(context).buttonColor,
                  avatar: CircleAvatar(
                    backgroundImage: NetworkImage(
                        "http://pic1.16pic.com/00/13/30/16pic_1330257_b.jpg"),
                  ),
                ),
                Chip(
                  label: Text("potato"),
                  onDeleted: () {},
                  deleteButtonTooltipMessage: "delete potato",
                ),
              ],
            ),
            Divider(
              color: Colors.black38,
              height: 18.0,
            ),
            Wrap(
              alignment: WrapAlignment.start,
              spacing: 20.0,
              runSpacing: 10.0,
              children: _tips.map((SmallTip tip) {
                return Chip(
                  label: Text(tip.title),
                  onDeleted: () {
                    setState(() {
                      _tips.remove(tip);
                    });
                  },
                );
              }).toList(),
            ),
            Divider(
              color: Colors.black38,
              height: 18.0,
            ),
            Container(
              child: Text("ActionChip:$_actionIndex"),
            ),
            Wrap(
              spacing: 10.0,
              children: _tips.map((SmallTip tip) {
                return ActionChip(
                    label: Text(tip.title),
                    onPressed: () {
                      setState(() {
                        _actionIndex = tip.id;
                      });
                    });
              }).toList(),
            ),
            Divider(
              color: Colors.black38,
              height: 18.0,
            ),
            Container(
              child: Text("FilterChip:${_filterIndex.map((SmallTip tip){
                return tip!=null?tip.title:"";
              }).toList()}"),
            ),
            Wrap(
              spacing: 10.0,
              children: _tips.map((SmallTip tip) {
                return FilterChip(
                    selected: _filterIndex.contains(tip),
                    label: Text(tip.title),
                    onSelected: (isSelect){
                  setState(() {
                    _filterIndex.contains(tip)?_filterIndex.remove(tip):_filterIndex.add(tip);
                  });
                });
              }).toList(),
            ),
            Divider(height: 18.0,color: Colors.black87,),
            Container(
              child: Text("ChoiceChip:$_choiceIndex"),
            ),
            Wrap(
              spacing: 10.0,
              children: _tips.map((SmallTip tip) {
                return ChoiceChip(
                    selected:_choiceIndex==tip.id,
                    label: Text(tip.title),
                    onSelected: (isSelect){
                      setState(() {
                        isSelect?_choiceIndex=tip.id:null;
                      });
                    });
              }).toList(),
            )
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.rotate_left),
        onPressed: () {
          setState(() {
            _tips = [
              SmallTip(11, "apple"),
              SmallTip(22, "banana"),
              SmallTip(33, "lemon"),
            ];
          });
        },
      ),
    );
  }
}
